<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>遍历each方法</title>
    <script src="jquery.min.js"></script>
</head>
<body>
    
    <div>1</div>
    <div>2</div>
    <div>3</div>

    <script>
        $(function(){
            // $(selector).each(function(index,demEle){}) 回调函数有2个参数，一个是index索引号，demEle是返回的dom对象 。所以需要给dom对象转jquery对象$(domEle)
            var arr=['red','green','purple'];
            // 第一种each方法 遍历相同的元素【适合遍历dom对象
            $('div').each(function(i,domEle){
                // 索引号可以自定义名称
                console.log(i);
                // 第二个参数是dom元素对象
                console.log(domEle);
                // dom对象转jquery对象
                var x = $(domEle);
                x.css('color',arr[i]);
            });

            // 第2种each遍历方法：既能遍历数组又能遍历对象  $.each(object,function(index,element){})   可以遍历任何对象  该方法主要用来处理数据
            $.each($('div'),function(i,ele){
                console.log(i);
            });
            // 遍历数组
            $.each(arr,function(i,ele){
                console.log(i);
                console.log(ele);
            });
            // 遍历对象
            $.each({
                name:'Tina',age:'16'
                },function(i,ele){
                console.log(i);//输出的是属性名
                console.log(ele);//输出的是属性值
            });


        })   
    </script>
</body>
</html>